<template>
	<div style="text-align: center; padding-top: 10vh"><image :src="payData.code_base64_img" style="width: 200px; height: 200px;" mode=""></image></div>
</template>

<!-- 订单支付页面 -->
<script>
import * as payApi from '@/api/payApi.js';
import * as orderApi from '@/api/orderApi.js';
import { mapState, mapMutations } from 'vuex';
export default {
	data() {
		return {
			orderNo: '',
			payData: {},
			timer: null // 轮询定时器
		};
	},
	computed: {
		...mapState(['userInfo'])
	},
	onLoad({ orderNo }) {
		console.log('orderNo: ' + orderNo);
		this.orderNo = orderNo;
		if (this.orderNo) this.orderPay();
	},
	destroyed() {
		clearInterval(this.timer);
		this.redirectToOrderList();
	},
	methods: {
		...mapMutations(['setUserInfo']),
		// 跳转到订单列表页面
		redirectToOrderList() {
			uni.reLaunch({
				url: '/pages/order/orderList'
			});
		},
		orderPay() {
			let that = this;
			let platform = uni.getSystemInfoSync().platform; // android|ios|windows|mac|devtools
			// 分电脑端支付和手机端支付
			if (platform === 'windows' || platform == 'mac') {
				// 支付二维码
				payApi.orderPay({
					orderNo: this.orderNo,
					payType: 'NATIVE',
					success: res => {
						this.payData = res.data;
						// 开启定时器：轮询电脑端扫码支付结果
						this.timer = setInterval(() => {
							orderApi.getOrderStatus({
								orderNo: that.orderNo,
								success: res => {
									console.log(that.orderNo + '的订单状态: ' + res.data);
									if (res.data != that.$config.orderStatus.NotPay) {
										clearInterval(that.timer);
										this.redirectToOrderList();
									}
								}
							});
						}, 3000);
					}
				});
			} else {
				// 手机端h5支付
				// #ifdef H5
				this.$msg('暂不支持H5支付方式');
				// payApi.orderPay({
				// 	orderNo: this.orderNo,
				// 	payType: 'H5',
				// 	success: res => {
				// 		this.payData = res.data;
				// 		window.open(this.payData.h5_url);
				// 	}
				// });
				// #endif

				// 手机端微信小程序支付
				// #ifdef MP-WEIXIN
				uni.login({
					provider: 'weixin',
					success: wxRes => {
						// eg: {code: "073BdF1w3us1mV2SRk1w3MDxpH3BdF1z", errMsg: "login:ok"}
						console.log('微信登录成功 获取到的授权码=', wxRes.code); // 微信授权码可以用来获取openid
						payApi.orderPay({
							orderNo: this.orderNo,
							payType: 'JSAPI',
							wxCode: wxRes.code,
							success: res => {
								let payData = res.data;
								uni.requestPayment({
									provider: 'wxpay',
									appId: payData.appId,
									timeStamp: payData.timeStamp, // 必须是string
									nonceStr: payData.nonceStr,
									package: payData.package,
									signType: payData.signType,
									paySign: payData.paySign,
									success: e => {
										console.log('支付成功', e);
										orderApi.confirmFinishPay({orderNo: this.orderNo}); // 完成支付-更新订单状态
									},
									fail: err => {
										console.log('支付失败：', err);
										uni.showModal({
											content: err
										});
									},
									complete: () => {
										this.redirectToOrderList();
									}
								});
							}
						});
					}
				});
				// #endif
			}
		}
	}
};
</script>

<style></style>
